<template>
	<view class="body">
		<xk-header title="设备报修"></xk-header>

		<view class="list">
			<view>
				<view v-if="!this.formInfo.repair_id" class="list-item">
					<view>设备信息<text class="com-req"></text>：</view>
					<view @click="goFacilityList" v-if="!deviceInfo" class="right-title1" style="color: #2C72FF;">请选择报修设备
					</view>
					<view @click="goFacilityList" v-else class="right-title1" style="color: #2C72FF;">
						{{ deviceInfo.device_code }}-{{ deviceInfo.device_name }}</view>
					<uni-icons @click="scanDevice" type="scan" style="margin-left: 10rpx;"></uni-icons>
					<!-- <image mode="aspectFill" class="jiantou" src="/static/jiantou.png"/> -->
				</view>
				<view v-else class="list-item">
					<view>设备信息：</view>
					<view class="right-title1" style="color: #2C72FF;">{{ data.device_code }}-{{ data.device_name }}</view>
					<!-- <uni-icons type="scan" style="margin-left: 10rpx;"></uni-icons> -->
					<!-- <image mode="aspectFill" class="jiantou" src="/static/jiantou.png"/> -->
				</view>
				<!-- <view v-if="deviceInfo" class="list-item">
					<view>详细地址<text class="com-req"></text>：</view>
					<input class="input-item" disabled style="text-align: right;" type="text" value="A1-7室外主机报故障H0" placeholder="请输入详细地址" placeholder-class="placeholder"/>
				</view> -->
				<!-- <uni-data-picker placeholder="请选择维修种类" popup-title="维修种类" :localdata="types"
							@change="typeChange">
					<view class="list-item">
						<view>维修种类:</view>
						<view :class="formInfo.repair_type_id ? 'right-title1' : 'right-title1 right-title1-empty'">{{formInfo.repair_type_id ? typeMap[formInfo.repair_type_id] : "请选择"}}</view>
						<image mode="aspectFill" class="jiantou" src="/static/jiantou.png"/>
					</view>
				</uni-data-picker> -->
				<!-- <biaofun-datetime-picker :defaultValue="defaultDate"
					start="2000-02-03 00:00"
					end="2200-10-28 23:59"
					fields="hour"
					@change="dealTimeChange"
				>
					<view class="list-item">
						<view>预约上门时间<text class="com-req"></text>：</view>
						<view :class="formInfo.appointment_time ? 'right-title1' : 'right-title1 right-title1-empty'">{{formInfo.appointment_time ? formInfo.appointment_time : "请选择"}}</view>
						<image mode="aspectFill" class="jiantou" src="/static/jiantou.png"/>
					</view>
				</biaofun-datetime-picker> -->
				<view style="padding: 30rpx 20rpx;">
					<u-row>
						<u-col span="4">
							<view style="font-size: 28rpx;color: #333333;margin: 10rpx 0rpx;">按排上门时间：</view>
						</u-col>
						<!-- <u-col span="6">

						</u-col> -->
						<u-col span="8">
							<view style="font-size: 28rpx;color: #CCCFDA;margin: 10rpx 0rpx;text-align: right;"
								@click="dateClick">{{
									formInfo.appointment_time }}</view>
						</u-col>
					</u-row>
				</view>
				<view>
					<u-datetime-picker :show="show" @confirm="timeConfirm" @close="timeClose" @cancel="timeCancel"
						:closeOnClickOverlay="true" v-model="defaultDate" mode="datetime" @change="dealTimeChange">
					</u-datetime-picker>
				</view>
				<picker :range="urgency" :value="urgencyIndex" range-key="data_text" @change="urgencyChange">
					<view class="list-item">
						<view>重要程度:</view>
						<view :class="formInfo.urgency !== '' ? 'right-title1' : 'right-title1 right-title1-empty'">
							{{ formInfo.urgency !== '' ? urgencyMap[formInfo.urgency] : "请选择" }}</view>
						<!-- <image mode="aspectFill" class="jiantou" src="/static/jiantou.png" /> -->
					</view>
				</picker>
				<view class="list-item textarea">
					<view>故障描述<text class="com-req"></text>：</view>
					<textarea v-model="formInfo.repair_content" placeholder="在此输入故障描述" placeholder-class="placeholder" />
				</view>
			</view>
		</view>

		<view class="from-item upload-img-item" style="margin-top: 20rpx;">
			<view class="title">上传现场照片</view>
			<upload-image :images="formInfo.apply_image" @onChange="(images) => { formInfo.apply_image = images }" />
		</view>
		<view class="from-item">
			<view class="title">备注</view>
			<textarea v-model="formInfo.apply_remark" type="text" placeholder="在此输入备注" placeholder-class="placeholder" />
		</view>
		<view class="common-bottom-view">
			<view class="common-btn" @click="subimtApply">提交</view>
		</view>
		<view class="common-zw"></view>


	</view>
</template>

<script>
import moment from 'moment'
export default {
	data() {
		return {
			uploadImgs: ['/static/temp/temp.jpeg'],
			data: {},
			orderMore: true,
			defaultDate: moment().format('YYYY-MM-DD HH:mm'),
			defaultDate2:'',
			urgency: [],
			urgencyMap: {},
			urgencyIndex: '',
			deviceInfo: '',
			scanInfo: '',
			formInfo: {
				repair_id: '',
				device_id: '',
				apply_image: '',
				appointment_time: '请选择',
				repair_content: '',
				apply_remark: '',
				urgency: '',
				isSubmit: true
			},
			notNull: {
				repair_content: "请填写设备故障描述",
				device_id: "请选择需维修的设备信息",
				appointment_time: "请选择预约上门时间"
			},
			show: false,
		};
	},
	onLoad(options) {
		if (options.repairId) {
			this.formInfo.repair_id = options.repairId
			this.getData()
		}
		this.initInfo()
	},
	onUnload() {
		uni.$off('selectDevice')
	},
	methods: {
		timeConfirm(e) {
			// console.log('e0', e)
			this.show = false
			// this.defaultDate = e.value
			// console.log('this.value1', this.value1)
			this.defaultDate2 = this.defaultDate
			this.defaultDate2 == '' ? this.formInfo.appointment_time = '请选择' : this.formInfo.appointment_time = this.defaultDate2
		},
		dateClick() {
			this.show = true
			// this.defaultDate2 == '' ? this.defaultDate = '请选择' : this.defaultDate = this.defaultDate2
		},
		timeClose() { this.show = false },
		timeCancel() { this.show = false },
		scanDevice() {
			// #ifdef H5
			this.scanResult('')
			// #endif
			// #ifndef H5
			uni.scanCode({
				onlyFromCamera: true,
				success: (res) => {
					console.log('条码类型：' + res.scanType);
					console.log('条码内容：' + res.result);
					// resolve(res)
					this.scanResult(res)
				}
			});
			// #endif

		},
		scanResult(res) {
			// #ifdef H5
			res = {
				result: 'http://localhost?type=facility&value=DC2021070014'
			}
			// #endif
			let params = res.result.split('?')[1]
			let type = ''
			let value = ''
			if (params) {
				params = params.split('&')
				for (let item of params) {
					if (item.startsWith('type=')) {
						type = item.split('=')[1]
					}
					if (item.startsWith('value=')) {
						value = item.split('=')[1]
					}
				}
			}
			if (type == 'facility' && value) {
				this.scanInfo = value;
				this.goFacilityList()
			} else {
				this.$util.toast('无法识别二维码')
			}
		},
		getData() {
			this.$api.baseData_getPdDeviceRepair(this.formInfo.repair_id).then((res) => {
				this.data = res.task
				this.formInfo.device_id = this.data.device_id
				this.formInfo.repair_content = this.data.repair_content
				this.formInfo.urgency = this.data.urgency
			})
		},
		goFacilityList() {
			uni.$off('selectDevice')
			uni.$on('selectDevice', (item) => {
				this.formInfo.device_id = item.device_id;
				this.deviceInfo = item
			})
			// console.log('this.scanInfo',this.scanInfo)
			uni.navigateTo({
				url: '/pagesB/common/facility-list?scanInfo=' + this.scanInfo
			})
		},
		initInfo() {
			this.$api.baseData_getToolDataList({
				code: "PD_DEVICE_REPAIR_URGENCY" + "_nostr"
			}).then(res => {
				// console.log('resres',res)
				this.urgency = res
				let urgencyMap = {}
				for (let item of res) {
					urgencyMap[item.data_value] = item.data_text
				}
				this.urgencyMap = urgencyMap
			})
			// console.log('this.urgencyMap',this.urgencyMap)
		},
		urgencyChange(e) {
			this.urgencyIndex = e.detail.value;
			console.log('eeee', e)
			this.formInfo.urgency = this.urgency[this.urgencyIndex].data_value
		},

		dealTimeChange(e) {
			this.formInfo.appointment_time = moment(e.dt).format('YYYY-MM-DD HH时')
		},

		subimtApply() {
			console.log('this.formInfo',this.formInfo)
			for (let item in this.notNull) {
				if (!this.formInfo[item]) {
					this.$util.toast(this.notNull[item]);
					return;
				}
			}
			this.$util.confirm({
				content: "确定提交维修申请？",
				confirmText: "确定"
			}).then(isConfirm => {
				if (isConfirm) {
					this.$util.post({
						url: "app/pdDeviceRepair/apply",
						data: this.formInfo,
					}).then(res => {
						uni.$emit('refreshHomeDataList')
						uni.$emit('refreshDeviceRepair')
						uni.redirectTo({
							url: '/pagesA/facility-fix/facility-fix-finish?type=apply'
						})
					})

				}
			})

		}
	}
}
</script>

<style lang="scss" scoped>
@import '@/common/from.scss';
</style>
